<%@page import="com.digitalchina.cfs.record.model.DiseaseRecord"%>
<%@ page language="java" import="java.util.*,com.opensymphony.xwork2.ActionContext" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="java.io.*"%>
<%@page import="java.text.SimpleDateFormat"%>
<%
	String webPath = request.getContextPath();
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<title>国家癌症信息中心病案监测网络平台</title>
	<meta charset="GBK">
	<link rel="stylesheet" type="text/css" href="<%=webPath%>/css/dzbl.css"/>
	<script type="text/javascript" src='<%=webPath%>/js/jquery-easyui-1.3.2/jquery-1.8.0.min.js'></script>
	<script type="text/javascript" src='<%=webPath%>/js/jquery-easyui-1.3.2/jquery.easyui.min.js'></script>
	<link href="<%=webPath%>/js/jquery-easyui-1.3.2/themes/default/easyui.css" rel="stylesheet" type="text/css" />
	<link href="<%=webPath%>/js/jquery-easyui-1.3.2/themes/icon.css" rel="stylesheet" type="text/css" />
	<script type="text/javascript" src='<%=webPath%>/js/jquery-easyui-1.3.2/locale/easyui-lang-zh_CN.js'></script>
	<script type="text/javascript" src='<%=webPath%>/js/common/common.js'></script>
	<script src='<%=webPath%>/js/echarts.js'></script>
	
	<script type="text/javascript">	
	
	option1 = {
			 title : {
			        text: '',
			        x : 'center'
			    },
			    tooltip : {
			        trigger: 'axis'
			    },
			    legend: {
			        data:['入院','出院'],
			        x : 'left'
			    },
			    toolbox: {
			        show : true,
			        feature : {
			            mark : {show: false},
			            dataView : {show: false, readOnly: false},
			            magicType : {show: true, type: ['line', 'bar']},
			            restore : {show: false},
			            saveAsImage : {show: true}
			        }
			    },
			    calculable : true,
		    xAxis : [
		        {
		        	axisLabel: {rotate: 17},
		            type : 'category',
		            data : ['北京肿瘤医院',
		                    '山西省肿瘤医院',
		                    '江苏省肿瘤医院',
		                    '吉林省肿瘤医院',
		                    '辽宁省肿瘤医院',
		                    '湖南省肿瘤医院',
		                    '河南省肿瘤医院',
		                    '云南省肿瘤医院',
		                    '甘肃省肿瘤医院',
		                    '黑龙江省肿瘤医院',
		                    '河北医科大学第四医院',
		                    '山东省肿瘤防治研究所',
		                    '中国医学科学院肿瘤医院',
		                    '新疆医科大学附属肿瘤医院'],
		        position : 'left'
		        }
		    ],
		    yAxis : [
		        {
		            type : 'value'
		        }
		    ],
		    series : [
		        {
		            name:'蒸发量',
		            type:'bar',
		            data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3],
		            markPoint : {
		                data : [
		                    {type : 'max', name: '最大值'},
		                    {type : 'min', name: '最小值'}
		                ]
		            },
		            markLine : {
		                data : [
		                    {type : 'average', name: '平均值'}
		                ]
		            }
		        },
		        {
		            name:'降水量',
		            type:'bar',
		            data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],
		            markPoint : {
		                data : [
		                    {name : '年最高', value : 182.2, xAxis: 7, yAxis: 183, symbolSize:18},
		                    {name : '年最低', value : 2.3, xAxis: 11, yAxis: 3}
		                ]
		            },
		            markLine : {
		                data : [
		                    {type : 'average', name : '平均值'}
		                ]
		            }
		        }
		    ]
		};
		                    
	
//--------------------------------------------
	var ec,theme;
	require.config({
		paths:{
			echarts:"<%=webPath %>/js/charts"
		}
	});
	require(
			[
				"echarts",
				'echarts/chart/line',
				'echarts/chart/bar',
				'echarts/chart/scatter',
				'echarts/chart/k',
				'echarts/chart/pie',
				'echarts/chart/radar',
				'echarts/chart/force',
				'echarts/chart/chord',
				'echarts/chart/gauge',
	            'echarts/chart/funnel',
	            'echarts/chart/eventRiver',
				"echarts/chart/map"
			],
			function(e,t){
				ec=e;
				theme=t;
				DrawEChart(ec,theme);
			}
		);

	function DrawEChart(ec,theme){
		DrawMap(ec,theme);
	};
	function DrawMap(ec,theme){
		 chart = ec.init(document.getElementById("in-out"),theme);
		 option = {
				    title : {
				        text: '入院/出院分布',
				        x : 'center'
				    },
				    tooltip : {
				        trigger: 'axis'
				    },
				    legend: {
				        data:['入院','出院'],
				        x : 'left'
				    },
				    toolbox: {
				        show : true,
				        feature : {
				            mark : {show: false},
				            dataView : {show: false, readOnly: false},
				            magicType : {show: true, type: ['line', 'bar']},
				            restore : {show: false},
				            saveAsImage : {show: true}
				        }
				    },
				    calculable : true,
				    xAxis : [
				        {
				            type : 'category',
				            data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月']
				        }
				    ],
				    yAxis : [
				        {
				            type : 'value',name : '人数'
				        }
				    ],
				    series : [
				        /* {
				            name:'入院',
				            type:'bar',
				            data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6,10,5,4],
				            markPoint : {
				                data : [
				                    {type : 'max', name: '最大值'},
				                    {type : 'min', name: '最小值'}
				                ]
				            },
				            markLine : {
				                data : [
				                    {type : 'average', name: '平均值'}
				                ]
				            } 
				        },
				        {
				            name:'出院',
				            type:'bar',
				            data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],
				            markPoint : {
				                data : [
				                    {type : 'max', name: '最大值'},
				                    {type : 'min', name: '最小值'}
				                ]
				            },
				            markLine : {
				                data : [
				                    {type : 'average', name: '平均值'}
				                ]
				            } 
				        } */
				    ]
				};
				                    
		 	//qryReqequest(orgCode,year,bz);
		 	//qryAllReqequest(year,bz);
			//chart.setOption(option1);
	}	


	function qryReqequest(org){
		var b = $('.txt-select-bz option:selected').val();
		var y = $('.txt-select-y option:selected').val();
		if(org == 'ALL'){
			var org_text = $('.onselect2').text();
			var bz_text = $('.txt-select-bz option:selected').text();
			var year_text = $('.txt-select-y option:selected').text();
			option1.title.text = year_text+"年 "+org_text+"  “"+bz_text+"” "+"入院/出院情况分析";
			/* qryAllReqequest(y,b); */
			var url = '<%= webPath%>/hospitalizedNumberAction!qryALLInOutHospitalized';
			$.ajaxSetup({
		        async: false
		    });
			$.post(url,{year:y,bz:b},
					function(data,resultStatus){
						if(resultStatus == 'success'){
							option1.series = data.series;
							option1.xAxis = data.xAxis;
							chart.hideLoading(); 
							chart.clear();
							chart.setOption(option1);
						}
					});
		}else{
			var org_text = $('.onselect2').text();
			var bz_text = $('.txt-select-bz option:selected').text();
			var year_text = $('.txt-select-y option:selected').text();
			option.title.text = year_text+"年 "+org_text+"  “"+bz_text+"” "+"入院/出院情况分析";
			var url = '<%= webPath%>/hospitalizedNumberAction!qryInOutHospitalized';
			$.ajaxSetup({
		        async: false
		    });
			$.post(url,{orgCode:org,year:y,bz:b},
					function(data,resultStatus){
						if(resultStatus == 'success'){
							chart.hideLoading(); 
							chart.clear();
							option.series = data;
							chart.setOption(option);
						}
					});
		}
	}
	
	function qryAllReqequest(y,b){
		var url = '<%= webPath%>/hospitalizedNumberAction!qryALLInOutHospitalized';
		$.ajaxSetup({
	        async: false
	    });
		$.post(url,{year:y,bz:b},
				function(data,resultStatus){
					if(resultStatus == 'success'){
						option1.series = data.series;
						option1.xAxis = data.xAxis;
					}
				});
	}
	
	var orgCode = 'ALL';
	
	$(function(){
		/* 选择医院 */
		$('.side-bar ul li a').click(function(){
			orgCode = $(this).attr('id');	
			$('.side-bar ul li a').removeClass();
			$(this).addClass("onselect2");
			qryReqequest(orgCode);
		});
		
		/* 选择病种 */
		$('.txt-select-bz').change(function(){
			qryReqequest(orgCode);
		});
		
		/* 选择年 */
		$('.txt-select-y').change(function(){
			qryReqequest(orgCode);
		});
		
		
		$('.data-list ul li a').click(function(){
			$('.data-list ul li a').removeClass();
			$(this).addClass("onselet");
			
		});
	});

		
	</script>
</head>
<body>
<form action="">
	<!--start-content----->
	<div class="content">
		<div class="wrap">
			<!--title信息-->
			<div class="services1">
				<div class="content-top-grid services-grid1">
					<div class="content-top-grid-header">
						<div class="content-top-grid-title" >
							<!-- <h3 style="text-align:center; font-size:22px;color:#337ab7">肿瘤流行病学

分析</h3> -->
						</div>
						<div class="clear">
						</div>
					</div>
				</div>
			</div>
			<!--End-title信息-->
			<div class="clearfix">
            	<div class="side-bar left">
                   <div class="clearfix hospital-title">
                		<p class="left">医院列表</p>
                        <div class="right">
                        	<a href="#"  class="s-left"></a>
                            <a href="#"  class="s-right"></a>
                        </div>
                    </div>
                	<ul>
                    	<li><a href="#" id="ALL" class="onselect2">所有医院</a></li>
                    	<li><a href="#" id="400005695">中国医学科学院肿瘤医院</a></li>
                        <li><a href="#" id="400689804">北京肿瘤医院</a></li>
                        <li><a href="#" id="414004538">黑龙江省肿瘤医院</a></li>
                        <li><a href="#" id="412761551">吉林省肿瘤医院</a></li>
                        <li><a href="#" id="46300557X">辽宁省肿瘤医院</a></li>
                        <li><a href="#" id="444878092">湖南省肿瘤医院</a></li>
                        <li><a href="#" id="415806735">河南省肿瘤医院</a></li>
                        <li><a href="#" id="431201824">云南省肿瘤医院</a></li>
                        <li><a href="#" id="43800257X">甘肃省肿瘤医院</a></li>
                        <li><a href="#" id="45760375X">新疆医科大学附属肿瘤医院</a></li>
                        <li><a href="#" id="405704540">山西省肿瘤医院</a></li>
                        <li><a href="#" id="401700382">河北医科大学第四医院</a></li>
                        <li><a href="#" id="49554077X">山东省肿瘤防治研究所</a></li>
                        <li><a href="#" id="466002702">江苏省肿瘤医院</a></li>
                    </ul>
                </div>
                <div class="data-list left ml10">
                	<ul class="clearfix">
                    	<li><a href="#" id="inout" class="onselet">入院/出院分布</a></li>
                    </ul>
                    <div class="clearfix mt10 analytic">
	                    <ul class="select-term clearfix mt20" style="text-align:center;">
	                    
	                      <li>
		                    	<span>查询时间</span>
		                        <select id="qryDate" class="txt-select-y">
		                        	<option value="2015" selected="selected">2015</option>
		                        	<option value="2014">2014</option>
		                        	<option value="2013">2013</option>
		                        	<option value="2012">2012</option>
		                        	<option value="2011">2011</option>
		                        </select>年
		                    </li>
							<li>
		                    	<span>常见病种</span>
		                        <select id="qryDate" class="txt-select-bz">
		                        	<option value="C001" selected="selected">胃癌</option>
		                        	<option value="C002">肝癌</option>
		                        	<option value="C003">肺癌</option>
		                        	<option value="C004">食管癌</option>
		                        	<option value="C005">宫颈癌</option>
		                        	<option value="C006">乳腺癌</option>
		                        	<option value="C007">直肠癌</option>
		                        	<option value="C008">结肠癌</option>
		                        </select>
		                    </li>
							
				    	</ul>
                    	<div class="left" style="width:100%; background:#fff; height:440px;">
                        	 <div id="in-out" style="width:100%; height:420px;" class="mt10">
    						</div>
                        </div>
                    </div>
              </div>
		 </div>
	  </div>
	</div>
	<!--End-content----->
</form>
<script type="text/javascript">
$(function(){
	var orgCode = 'ALL';
	var bz_text = $('.txt-select-bz option:selected').text();
	var year_text = $('.txt-select-y option:selected').text();
	option1.title.text = year_text+"年 所有医院  “"+bz_text+"” "+"入院/出院情况分析";
	qryReqequest(orgCode);
});
</script>
</body>
</html>